<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="/assets/common/common.css" />
    <link rel="stylesheet" href="/assets/iconfont/iconfont.css" />
    <link rel="stylesheet" href="../InitiateApproval/InitiateApproval.css" />
    <title>Document</title>
  </head>
  <body class="InitiateApproval">
    <!-- 导航栏 -->
    <div class="top bg-fff w100 fixed flex aic jc-sb pl-20 pr-20">
      <a href="../Approval.html" class="icon">
        <i class="iconfont icon-zuojiantou"></i>
      </a>
      <div>发起审批</div>
      <div class="icon"></div>
    </div>
    <!-- 信息 -->
    <ul class="information w100 bg-fff">
      <li class="item-inp flex aic ml-20">
        <div class="text">
          <span class="required">*</span>
          <span class="t-999 f14">姓名</span>
        </div>
        <div>
          <input class="inp flex fg1 aic" type="text" placeholder="请输入" />
        </div>
      </li>
      <li class="item-inp flex aic ml-20">
        <div class="text">
          <span class="required">*</span>
          <span class="t-999 f14">手机号码</span>
        </div>
        <div>
          <input class="inp flex fg1 aic" type="text" placeholder="请输入" />
        </div>
      </li>
      <li class="item flex aic ml-20">
        <div class="text">
          <span class="t-999 f14">入职部门</span>
        </div>
        <div class="pr-15 fg1 flex aic jc-sb">
          <input class="inp" type="text" placeholder="请选择" />
          <i class="iconfont icon-jiantou"></i>
        </div>
      </li>
      <li class="item flex aic ml-20">
        <div class="text">
          <span class="t-999 f14">上级负责人</span>
        </div>
        <div class="pr-15 fg1 flex aic jc-sb">
          <input class="inp" type="text" placeholder="请选择" />
          <i class="iconfont icon-jiantou"></i>
        </div>
      </li>

      <li id="learn" class="item flex aic ml-20">
        <div class="text">
          <span class="t-999 f14">学历</span>
        </div>
        <div class="pr-15 fg1 flex aic jc-sb">
          <input class="inp" type="text" placeholder="请选择" />
          <i class="iconfont icon-jiantou"></i>
        </div>
      </li>

      <li id="position" class="item flex aic ml-20">
        <div class="text">
          <span class="t-999 f14">职位</span>
        </div>
        <div class="pr-15 fg1 flex aic jc-sb">
          <input class="inp" type="text" placeholder="请选择" />
          <i class="iconfont icon-jiantou"></i>
        </div>
      </li>

      <li id="staff" class="item flex aic ml-20">
        <div class="text">
          <span class="t-999 f14">员工类型</span>
        </div>
        <div class="pr-15 fg1 flex aic jc-sb">
          <input class="inp" type="text" placeholder="请选择" />
          <i class="iconfont icon-jiantou"></i>
        </div>
      </li>
      <li class="item flex aic ml-20">
        <div class="text">
          <span class="required">*</span>
          <span class="t-999 f14">合同公司</span>
        </div>
        <div class="pr-15 fg1 flex aic jc-sb">
          <input class="inp" type="text" placeholder="请选择" />
          <i class="iconfont icon-jiantou"></i>
        </div>
      </li>
      <li class="item flex aic ml-20">
        <div class="text">
          <span class="required">*</span>
          <span class="t-999 f14">员工状态</span>
        </div>
        <div class="pr-15 fg1 flex aic jc-sb">
          <input class="inp" type="text" placeholder="请选择" />
          <i class="iconfont icon-jiantou"></i>
        </div>
      </li>
      <li class="item flex aic ml-20">
        <div class="text">
          <span class="required">*</span>
          <span class="t-999 f14">预计入职日期</span>
        </div>
        <div class="pr-15 fg1 flex aic jc-sb">
          <input class="inp" type="text" placeholder="请选择" />
          <i class="iconfont icon-jiantou"></i>
        </div>
      </li>
      <li class="item-inp flex aic ml-20">
        <div class="text">
          <span class="t-999 f14">试用期(月)</span>
        </div>
        <div>
          <input class="inp flex fg1 aic" type="text" placeholder="请输入整数" />
        </div>
      </li>

      <li id="enclosure" class="item-upload flex aic ml-20">
        <div class="upload f14 t-999">
          <span>上传附件</span>
          <span>📎</span>
        </div>
        <div class="text f12 fg1 pl-25 pr-20">支持pdf, doc, docx, html, txt, jpg, png等格式文件上传，文件大小不超过10MB</div>
      </li>
    </ul>

    <!-- 审批人 -->
    <div class="approver w100 mt-15 bg-fff flex fdc jc-c rel">
        <div class="text flex aic">
          <span class="text_x f18">*</span>
          <span class="f18">审批人</span>
          <span class="f14 t-999 pl-10">2人依次审批</span>
        </div>
        <div class="picture flex aic pb-15 pl-10">
          <div class="flex fdc aic rel">
            <img class="img_x flex abs" src="/assets/img/Approval-img/u4256.png" alt="">
            <img src="/assets/img/Approval-img/u4254.png" alt="">
            <span>邵苑杰</span>
          </div> 
          <span class="greater f30 pb-15">></span>
          <div class="flex fdc aic rel ">
            <img class="img_x flex abs" src="/assets/img/Approval-img/u4256.png" alt="">
            <img src="/assets/img/Approval-img/u4258.png" alt="">
            <span>施雁芙</span>
          </div>
          <span class="greater  f30 pb-15">></span>
          <div class="pictur fcc abs">
            <i class="iconfont icon-jia"></i>
          </div>
        </div>
    </div>
    <!-- 抄送人 -->
    <div class="cc w100 mt-15 bg-fff flex fdc jc-c rel">
      <div class="text flex aic">
        <span class="text_x f18">*</span>
        <span class="f18">审批人</span>
        <span class="f14 t-999 pl-10">2人依次审批</span>
      </div>
      <div class="picture flex aic pb-15 pl-10">
        <div class="flex fdc aic rel">
          <img class="img_x flex abs" src="/assets/img/Approval-img/u4256.png" alt="">
          <img src="/assets/img/Approval-img/u4254.png" alt="">
          <span>邵苑杰</span>
        </div> 
        <span class="greater f30 pb-15">></span>
        <div class="flex fdc aic rel ">
          <img class="img_x flex abs" src="/assets/img/Approval-img/u4256.png" alt="">
          <img src="/assets/img/Approval-img/u4258.png" alt="">
          <span>施雁芙</span>
        </div>
        <span class="greater  f30 pb-15">></span>
        <div class="pictur fcc abs">
          <i class="iconfont icon-jia"></i>
        </div>
      </div>
    </div>
    <!-- 底部 -->
    <div class="footer w100 fixed bg-fff  fcc ">
        <span class="word fff fcc">提交</span>
    </div>

    <!-- 学历点击 -->
    <div class="educationClick fixed w100 dsn">
      <div class="culture bg-fff fcc t-999">请选择文化程度</div>
      <div class="education bg-fff fcc">小学</div>
      <div class="education bg-fff fcc">初中</div>
      <div class="education bg-fff fcc">高中/中专</div>
      <div class="education bg-fff fcc">大专以上</div>
      <div class="education bg-fff fcc">不详</div>
      <div class="education cancel bg-fff fcc mt-10">取消</div>
    </div>
    <!-- 职位点击 -->
    <div class="occupationClick fixed w100 dsn">
      <div class="culture bg-fff fcc t-999">请选择</div>
      <div class="occupation bg-fff fcc">产品经理</div>
      <div class="occupation bg-fff fcc">设计主管</div>
      <div class="occupation bg-fff fcc">设计师</div>
      <div class="occupation bg-fff fcc">前台</div>
      <div class="occupation cancel bg-fff fcc mt-10">取消</div>
    </div>
    <!-- 员工类型点击 -->
    <div class="employeeClick fixed w100 dsn">
      <div class="culture bg-fff fcc t-999">请选择</div>
      <div class="employee bg-fff fcc">全职</div>
      <div class="employee bg-fff fcc">兼职</div>
      <div class="employee bg-fff fcc">实习</div>
      <div class="employee bg-fff fcc">临时工</div>
      <div class="employee cancel bg-fff fcc mt-10">取消</div>
    </div>
    <!-- 上传附件点击 -->
    <div class="attachmentsClick fixed w100 dsn">
      <div class="attachments bg-fff fcc">拍照</div>
      <div class="attachments bg-fff fcc">文件</div>
      <div class="attachments bg-fff fcc">相册</div>
      <div class="attachments cancel bg-fff fcc mt-10">取消</div>
    </div>


    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script>
      //学历点击
      $(".information").on("click", "#learn", function () {
        $(this).closest(".information").next().show();
      });
      
      $('.education').on('click', function(item){
        if($(this).text()=== "小学"||$(this).text()=== "初中"||$(this).text()=== "高中/中专"||$(this).text()=== "大专以上"||$(this).text()=== "不详"||$(this).text()=== "取消"){
          $(this).parent().hide()
        }
        // console.log($(this).text());
      })
      //职位点击
      $(".information").on("click", "#position", function () {
        $(this).closest(".information").next().next().show();
      });
      $('.occupation').on('click', function(item){
        if($(this).text()=== "产品经理"||$(this).text()=== "设计主管"||$(this).text()=== "设计师"||$(this).text()=== "前台"||$(this).text()=== "取消"){
          $(this).parent().hide()
        }
      })
      //员工类型点击
      $(".information").on("click", "#staff", function () {
        $(this).closest(".information").next().next().next().show();
      });
      $('.employee').on('click', function(item){
        if($(this).text()=== "全职"||$(this).text()=== "兼职"||$(this).text()=== "实习"||$(this).text()=== "临时工"||$(this).text()=== "取消"){
          $(this).parent().hide()
        }
      })
      //上传点击
      $(".information").on("click", "#enclosure", function () {
        $(this).closest(".information").next().next().next().next().show();
      });
      $('.attachments').on('click', function(item){
        if($(this).text()=== "拍照"||$(this).text()=== "文件"||$(this).text()=== "相册"||$(this).text()=== "取消"){
          $(this).parent().hide()
        }
      })
    </script>
  </body>
</html>
